<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta name="viewport"
			content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<meta name="format-detection" content="telephone=no" />
		<base target="_blank"/>
		<link rel="stylesheet" href="{cms>:$cssPath}/spg.css">
		
		<title>搜索结果</title>
 		<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

		<style type="text/css">
			#assurance div{
				background-color: white;
				position: relative
			}
			.icon-info {
			    font-family: 'starwood';
			    speak: none;
			    font-style: normal;
			    font-weight: normal;
			    font-variant: normal;
			    text-transform: none;
			    line-height: 1;
			    -webkit-font-smoothing: antialiased;
			}
			span.brg-check {
				position: absolute;
				top: -19px;
				left: 2px;
			}
			body{
				background-color: #271a40;
				margin: 0;
			}
			#content{
				background-color: white;
				font: normal 16px arial;
				margin: 10px 10px;
				line-height: 30px;
				text-align: left;
			}
			#assurance div{
				font: bold 16px arial;
				color: #664f8c;
			}
			#assurance img{
				position: relative;
			}
			a{		
				text-decoration: none;
				font: bold 16px arial;
				color: #664f8c;
			}
			#footer_span{
				bottom: 60px;
			}
			.hotel img{
				width:100%;
				border-radius:3px;
			}
			.address{
				background-color: rgb(238,239,242);
				padding: 10px;
				border-radius: 3px;
				text-align:left;
			}
			.hoteldetail{
				background-color: rgb(238,239,242);
				border-top: solid 1px #271a40;
				text-align:center;
				display:none;
			}
			.hoteldetail table{
				width:100%;
			}
			.hoteldetail .button{
				background-color: rgb(102,79,140);
				padding: 10px;
				margin: 8px;
				border-radius: 3px;
				color:white;
			}
			.hoteldetail td, .hoteldetail tr{
				background-color: white;
			}
			.hotel img.arrow.up{
				top:0px;
				-webkit-transform:rotate(0deg);
			}
			.hotel img.arrow, .hotel img.arrow.down{
				width: 15%; 
				padding-top:15px;
				cursor:pointer;
				position: relative;
				top: 20px;
				-webkit-transform:rotate(180deg);
			}
			.arrowUp{
				-webkit-animation:rotateArrowUp 0.5s ;
			}
			@-webkit-keyframes rotateArrowUp /* Safari and Chrome */
			{
				0%   {-webkit-transform:rotate(0deg); top:4px; }
				25%  {-webkit-transform:rotate(40deg); top:8px; }
				50%  {-webkit-transform:rotate(80deg); top:12px; }
				75%  {-webkit-transform:rotate(130deg); top:16px; }
				100% {-webkit-transform:rotate(180deg); top:20px; }
			}
			.arrowDown{
				-webkit-animation:rotateArrowDown 0.5s ;
			}
			@-webkit-keyframes rotateArrowDown /* Safari and Chrome */
			{
				0%   {-webkit-transform:rotate(0deg); top:16px; }
				25%  {-webkit-transform:rotate(40deg); top:12px; }
				50%  {-webkit-transform:rotate(80deg); top:8px; }
				75%  {-webkit-transform:rotate(130deg); top:4px; }
				100% {-webkit-transform:rotate(180deg); top:0px; }
			}
			.up{			
				position: relative;
				top: -30px;
			}
			.opatext{
				padding: 5px;
				color: white;
				font-size: 18px;
				background-color: black;
				opacity: 0.58;
				text-align: center;
				position: relative;
				top: -50px;
			}
		</style>
	</head>
	
	<body>
		<div id="content" style="">	
			<div style="padding: 10px; text-align:center; ">
				搜索到{cms>:$total}家酒店
				<div>
					<a href="http://m.starwoodhotels.com/corporate/search/filter.html?stateProvince={cms>:$stateCode}&country={cms>:$countryCode}&departureDate={cms>:$departureDate}&arrivalDate={cms>:$arrivalDate}&numberOfRooms={cms>:$roomNum}&numberOfAdults={cms>:$adultNum}&localeCode=zh_CN&skinName=corporate&rp=RC:BARRLM,RP:SPG,RP:SPGCPN">
					<p style="background-color: rgb(230,225,206);padding: 10px;margin: 8px;border-radius: 3px;">
						筛选结果</p>
					</a>
				</div>
			</div>
		</div>
		
	<volist name="hotels" id="hotel">
		<div id="content" style="">	
			<div class="hotel" style="padding: 10px; text-align:center; ">
				<a href="{cms>:U('Booking/hoteldetail',array('hotelCode'=>$hotel['hotelCode'],'openid'=>$_GET['openid']))}"><img src="{cms>:$hotel['img']}"/></a>
				<div class="opatext">{cms>:$hotel['name']}</div>
				<div class="address up" style="">
						{cms>:$hotel['addr']}
				</div>
				<div class="up">
					<img class="arrow" style="" src="{cms>:$imagePath}/searchresult3_13.png" />
				</div>
			</div>
				<div class="hoteldetail up">
								<a href="http://m.starwoodhotels.com/mobile/rates/room.html?propertyId={cms>:$hotel['hotelCode']}&departureDate={cms>:$departureDate}&arrivalDate={cms>:$arrivalDate}&numberOfRooms={cms>:$roomNum}&numberOfAdults={cms>:$adultNum}&language=zh_CN&skinName=stregis"><p class="button" style="">
									预订</p>
								</a>
				</div>
		</div>
	</volist> 
			
		<!-- 
		<div id="content" style="">	
			<div class="hotel" style="padding: 10px; text-align:center; ">
				<a href="{cms>:U('Booking/hoteldetail',array('openid'=>$openid))}"><img src="{cms>:$imagePath}/searchresult1.jpg"/></a>
				<div class="address" style="">
						加拿大安大略省，伦敦 威灵顿南路 1150号
				</div>
				<div>
					<img class="arrow" style="" src="{cms>:$imagePath}/searchresult3_13.png" />
				</div>
			</div>
				<div class="hoteldetail">
					<table>
						<tr>
							<th>房型</th>
							<th>价格</th>
							<th>预订</th>
						</tr>
						<tr>
							<td>豪华行政房</td>
							<td>800</td>
							<td>
								<a href="{cms>:U('Booking/choosebyroom',array('openid'=>$openid))}"><p class="button" style="">
									预订</p>
								</a>
							</td>
						</tr>
						<tr>
							<td>至尊行政房</td>
							<td>1000</td>
							<td>
								<a href="{cms>:U('Booking/choosebyroom',array('openid'=>$openid))}"><p class="button" style="">
									预订</p>
								</a>
							</td>
						</tr>
						<tr>
							<td>尊尚行政房</td>
							<td>1600</td>
							<td>
								<a href="{cms>:U('Booking/choosebyroom',array('openid'=>$openid))}"><p class="button" style="">
									预订</p>
								</a>
							</td>
						</tr>
					</table>
				</div>
		</div>
		<div id="content" style="">	
			<div class="hotel" style="padding: 10px; text-align:center; ">
				<a href="{cms>:U('Booking/hoteldetail',array('openid'=>$openid))}"><img src="{cms>:$imagePath}/searchresult1.jpg"/></a>
				<div class="address" style="">
						加拿大安大略省，伦敦 威灵顿南路 1150号
				</div>
				<div>
					<img class="arrow" style="" src="{cms>:$imagePath}/searchresult3_13.png" />
				</div>
			</div>
				<div class="hoteldetail">
					<table>
						<tr>
							<th>房型</th>
							<th>价格</th>
							<th>预订</th>
						</tr>
						<tr>
							<td>豪华行政房</td>
							<td>800</td>
							<td>
								<a href="{cms>:U('Booking/choosebyroom',array('openid'=>$openid))}"><p class="button" style="">
									预订</p>
								</a>
							</td>
						</tr>
						<tr>
							<td>至尊行政房</td>
							<td>1000</td>
							<td>
								<a href="{cms>:U('Booking/choosebyroom',array('openid'=>$openid))}"><p class="button" style="">
									预订</p>
								</a>
							</td>
						</tr>
						<tr>
							<td>尊尚行政房</td>
							<td>1600</td>
							<td>
								<a href="{cms>:U('Booking/choosebyroom',array('openid'=>$openid))}"><p class="button" style="">
									预订</p>
								</a>
							</td>
						</tr>
					</table>
				</div>
		</div>
		 -->
		 
	<script type="text/javascript">
		  $(document).ready(function(){		  
		     $(".arrow").click(function(){
		    	 if($(this).hasClass('up')){
			    	 //$(this).removeClass('arrowUp');
			    	 //$(this).addClass('arrowDown');
		    		 $(this).removeClass('up');
		    		 $(this).addClass('down');
		    		 //hide
		    		 $(this).parent().parent().next().css('display', 'none');
		    	 }else{
			    	 //$(this).removeClass('arrowDown');
			    	 //$(this).addClass('arrowUp');
		    		 $(this).removeClass('down');
		    		 $(this).addClass('up');
		    		 //show
		    		 $(this).parent().parent().next().css('display', 'block');
		    	 }
			 });
		     
		  })
		</script>
		
<include file="footer2"/>